<template>
  <div class="flex-grow-1 container-p-y" :class="[layout]">
    <!-- <el-button @click="handleSwitchTheme">换对方皮肤</el-button> -->
    <iframe id="docFrame" :src="url" @οnlοad="onLoaded" width="100%" height="100%" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="yes" allowtransparency="yes"></iframe>
    <div class="help-page" v-if="false">
      <div class="help-search-box">
        <div class="con-box">
          <div class="b-it">Hello,how can we help?</div>
          <div class="or-it">or choose a category to quickly find the help you need</div>
          <el-input type="search" placeholder="Ask a question...."><i slot="prefix" class="ti ti-search"
              style="margin-top:9px;margin-left:10px;"></i></el-input>
        </div>
      </div>
      <div class="row mt-4 pt-2">
        <div class="col-lg-3 col-md-4 col-12 mb-md-0 mb-3">
          <div class="d-flex justify-content-between flex-column mb-2 mb-md-0">
            <ul class="nav nav-pills flex-column flex-md-row mb-6 gap-2 gap-lg-0 help-cates">
              <li class="nav-item"><a class="nav-link waves-effect waves-light" :class="[tab == 1 ? 'active' : '']"
                  @click="tab = 1"><i class="ti-xs ti ti-users me-1"></i> # 一.公共参数</a></li>
              <li class="nav-item"><a class="nav-link waves-effect waves-light" :class="[tab == 2 ? 'active' : '']"
                  @click="tab = 2"><i class="ti-xs ti ti-lock me-1"></i> # 二.通过api对接</a></li>
              <li class="nav-item"><a class="nav-link waves-effect waves-light" :class="[tab == 3 ? 'active' : '']"
                  @click="tab = 3"><i class="ti-xs ti ti-lock me-1"></i> # 三.通过OTPAPP软件（提供软件）</a></li>
            </ul>
          </div>
        </div>
        <div class="col-lg-9 col-md-8 col-12">
          <template v-if="tab == 1">
            <div class="help-con-header">
              <span class="img-box">
                <i class="ti ti-building-bank"></i>
              </span>
              <div class="tits">
                <span class="tit-val">公共参数</span>
                <span class="tit-desc">Get help with payment</span>
              </div>
            </div>
            <el-card header="When is payment taken for my order?" class="help-cnt">
              请求地址：url=https://112.124.43.68:10017/

              token看mainpage主页（https://112.124.43.68:10017/index）

              token=**eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJ4eHgxMTEiLCJ1dWlkIjoiYWx3YXlzLTUiLCJ1c2VyaWQiOiI1In0.l3cM1gF1kA2Yb1uDNJ7E-2Mz8VDsJOmxRbtZNsCRStnBzwIVnNAfnqBracTW************



              **说明：系统上所有的时间都是UTC时间。**
            </el-card>
          </template>

          <template v-if="tab == 2">
            <div class="help-con-header">
              <span class="img-box">
                <i class="ti ti-building-bank"></i>
              </span>
              <div class="tits">
                <span class="tit-val">通过api对接</span>
                <span class="tit-desc">Get help with payment</span>
              </div>
            </div>
            <el-card header="When is payment taken for my order?" class="help-cnt">
              ## 1.领取gmai api

              ### ①.请求邮箱

              url+/prod/mail/order/rentMail?**mailTypeCode=gmail**&**platform=facebook**&**token=eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJ4eHgxMTEiLCJ1dWlkIjoiYWx3YXlzLTUiLCJ1c2VyaWQiOiI1In0.l3cM1gF1kA2Yb1uDNJ7E-2Mz8VDsJOmxRbtZNsCRStnBzwIVnNAfnqBracTW************

              - token（必填）账号token 请联系客服。
              - mailTypeCode（必填） 邮箱类型，例如：gmail,hotmail,
              - platform（必填） 平台 ,例如：facebookall,telegram,apple,tiktok,amazon,instagram

              请求方式：GET

              响应结果-成功：

              ```json
              {
              "msg": "操作成功",
              "code": 200,
              "data": {
              "createBy": "XXXX",
              "createTime": "2024-04-30 21:14:28",
              "updateTime": "2024-04-30 21:14:28",
              "delFlag": "0",
              "orderId": "20240430211428802", // 订单号，获取邮箱验证码时使用。
              "rentBonus": 0.03470,
              "multipleOtp": 1, //
              "email": "gaiden489@gmail.com", // 邮箱
              "platform": "apple",
              "mailTypeCode": "gmail"
              }
              }
              ```

              响应结果-失败：

              ```json
              {
              "msg": "There is no email at this time", // 这里代表没有邮箱了，请稍后再试。继续领取就有了。
              "code": 500
              }
              ```



              ### ②.获取邮箱验证码

              请求地址：

              url+/prod/mail/order/mailOtp?**orderId=orderId**&**token=eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJ4eHgxMTEiLCJ1dWlkIjoiYWx3YXlzLTUiLCJ1c2VyaWQiOiI1In0.l3cM1gF1kA2Yb1uDNJ7E-2Mz8VDsJOmxRbtZNsCRStnBzwIVnNAfnqBracTW************

              - token（必填）账号token 请联系客服。
              - orderId 订单编号

              请求方式：GET

              响应结果-成功：

              ```json
              {
              "msg": "操作成功",
              "code": 200,
              "data": {
              "mailTypeCode": "gmail",
              "createTime": "2024-06-15T22:44:54.000+0800", //邮箱领取时间
              "otp": "689726", // 验证码
              "updateTime": "2024-06-16T14:45:01.000+0800",//otp上传时间，多次使用，就是代表最后一次上传时间
              "multipleOtp": 0,
              "platform": "telegram"
              }
              }

              ```



              响应结果-失败-邮箱没有otp：

              ```json
              {
              "msg": "No otp",,// 没有获取验证码，请继续获取验证码,验证码一般是3-6秒来
              "code": 500,
              "data": {
              "createTime": "2024-06-16T11:42:21.000+0800",
              "otp": "",
              "updateTime": "2024-06-16T12:38:55.000+0800"
              }
              }
              ```

              响应结果-失败-邮箱领取otp频率过快：

              ```json
              {
              "msg": "操作失败",
              "code": 500,
              "data": {
              "createTime": "2024-09-26T03:32:39.000+0000",
              "otp": "",
              "updateTime": "2024-09-26T03:33:04.000+0000"
              },
              "limit": "The order can only be retrieved once every 1 seconds!" // 每一个订单 每秒获取次数为1次，如果需要更快请联系客服。
              }
              ```

              响应结果-失败-邮箱超时：

              ```json
              {
              "msg": "This email has timed out",// 此邮箱已经失效了，换下一个邮箱。
              "code": 500
              }

              ```



              **扣费说明**

              1.领取邮箱后就扣费成功，所以领取邮箱后，要使用。

              2.如果在领取后，在使用过程，邮箱死了，自动退费。



              ## 2.领取邮箱账号密码

              请求地址：

              url+/prod/mail/order/rentMail?mailTypeCode=gmail&platform=facebook&token=eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJ4eHgxMTEiLCJ1dWlkIjoiYWx3YXlzLTUiLCJ1c2VyaWQiOiI1In0.l3cM1gF1kA2Yb1uDNJ7E-2Mz8VDsJOmxRbtZNsCRStnBzwIVnNAfnqBracTW**************************

              - token（必填）账号token 请联系客服。

              - mailTypeCode（必填） 邮箱类型 必须填写 gmail

              - platform（必填） 平台 必须填写 （这里联系客服，客服会给你具体的参数）



              请求方式：GET

              响应结果-成功：

              ~~~json
              {
              "msg": "操作成功",
              "code": 200,
              "data": {
              "createBy": "测试用户",
              "createTime": "2024-05-27 22:58:08",
              "updateTime": "2024-05-27 22:58:08",
              "mailRepoId": 221538,
              "orderId": "1716819551750",
              "rentBonus": -0.04790,
              "multipleOtp": 0,
              "email": "gailroy1743@gmail.com", 邮箱
              "psw": "d9hxmugj2CeV", 密码
              "femail": "30tuegd@dwmail.link", 辅助邮箱
              "platform": "account",
              "mailTypeCode": "gmail",
              "failureTime": 1440,
              "statusSuccess": false
              }
              }
              ~~~

              响应结果-失败：

              ```json
              {
              "msg": "There is no email at this time", // 这里代表没有邮箱了，请稍后再试。继续领取就有了。
              "code": 500
              }
              ```



              ## 3.获取当前账号积分

              请求地址：

              url+/prod/bonus/account/mine?token=eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJ4eHgxMTEiLCJ1dWlkIjoiYWx3YXlzLTUiLCJ1c2VyaWQiOiI1In0.l3cM1gF1kA2Yb1uDNJ7E-2Mz8VDsJOmxRbtZNsCRStnBzwIVnNAfnqBracTW**************************

              ```json
              {
              "msg": "操作成功",
              "code": 200,
              "data": {
              "id": 4281,
              "createBy": "xxx", // 当前账号
              "createTime": "2024-07-10 15:14:59",
              "updateTime": "2024-07-18 12:56:03",
              "delFlag": "0",
              "balance": 288.58820 // 当前最新积分
              }
              }

              ```
            </el-card>
          </template>

          <template v-if="tab == 3">
            <div class="help-con-header">
              <span class="img-box">
                <i class="ti ti-building-bank"></i>
              </span>
              <div class="tits">
                <span class="tit-val">通过OTPAPP软件（提供软件）</span>
                <span class="tit-desc">Get help with payment</span>
              </div>
            </div>
            <el-card header="When is payment taken for my order?" class="help-cnt">
              **注意：联系客服领取软件**

              **找一台平时不用的电脑（这个电脑上千万不要涉及钱（usdt）和其他账号相关（例如tg））**

              **软件没有病毒，避免一切问题，一切纠纷避免。**

              ## 1.批量领取gmail api

              服务器地址：https://112.124.43.68:10017/

              邮箱类型：gmail

              服务类型：例如：apple 可以填写 facebook,telegram,apple,tiktok,amazon,instagram

              提取数量：1-100000 注意提取了就扣费,用多少提取多少。

              授权凭证：token token看mainpage主页



              开始提取：点击开始提取后，就自动提取。等待提取完成。中途可以点击停止。尽量不要点击，防止丢失。

              保存结果：提取完成后，保存到本地。



              注意：如果想要更快速度，请多开软件。



              ## 2.批量领取邮箱 账号

              服务器地址：https://112.124.43.68:10017/

              邮箱类型：gmail

              服务类型：**（这里联系客服，客服会给你具体的参数）**
            </el-card>
          </template>
        </div>
      </div>
    </div>
    <Footer :layout="layout" />
  </div>
</template>

<script>

import Footer from '../../../components/Footer'
import { getDicts } from "@/api/system/dict/data";

export default {
  name: "ApiDoc",
  components: { Footer },
  data() {
    return {
      newUrl:'',
      tab: 1,
      fileTypeOptions: [],
      // 用户导入参数
      url: '' //'/apihtml/api.html',
    };
  },
  computed: {
    layout() {
      return localStorage.getItem('v-layout-content') || 'container-xxl';
    }
  },
  mounted() {
    let lang=localStorage.getItem('sys-language')|| 'en';
    if(!lang||lang=='en'){
      this.newUrl='https://theme-hope.vuejs.press/guide/feature/code-block.html#prism-js';
    }else{
      this.newUrl='https://theme-hope.vuejs.press/zh/guide/feature/code-block.html#prism-js';
    }
    // let docId = this.$route.query && this.$route.query.type;
    const docId = this.$route.params && this.$route.params.type;

    let that=this;
    // if (docId) {
    getDicts("upload_file_type").then(response => {
      if(response.data){
        let data=response.data.filter(r=>{
          return r.dictLabel==lang+'-api';
        })
        if(data.length>0){
          that.url=data[0].dictValue;
          console.log(that.url)
        }
      }

      // this.fileTypeOptions = response.data;


      // const title = this.selectDictLabel(this.fileTypeOptions, docId);
      // //this.meta.title = title + '文档';
      // console.log('docId:', docId, title);
      // // this.$route.metaTitle = title + '文档';
      // // this.$store.dispatch('tagsView/updateViewTitle', this.$route)
    });
    // this.url = '/apihtml/' + docId + '.html';
    // } else {
    //   this.url = '/apihtml/api.html';
    // }
  },
  beforeDestroy: function () {
  },
  methods: {
    onLoaded(e){
      debugger
    },
    handleSwitchTheme(){
      console.log(document.getElementById('docFrame'))
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
      this.getList();
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
  }
};
</script>
<style lang="scss" scoped>
.help-page {
  padding-bottom: 5rem;
}

::v-deep .el-dialog__body {
  padding: 20px 20px 5px 20px;
  border-style: solid;
  border-width: 0px 0 2px 0;
  border-color: whitesmoke;
}

::v-deep .el-dialog__footer {
  padding: 12px 20px;
}

@media (max-width: 480px) {
  ::v-deep .el-dialog__body {
    padding: 20px 20px 5px 20px;
    border-style: solid;
    border-width: 0px 0 2px 0;
    border-color: whitesmoke;
  }

  ::v-deep .el-dialog__footer {
    padding: 12px 20px;
  }

  ::v-deep .el-pagination__sizes {
    margin: 0;
  }

  ::v-deep .el-pagination .el-select .el-input {
    width: 85px;
    margin: 0;
  }

  ::v-deep .el-pagination__total {
    margin-right: 2px;
  }

  ::v-deep .el-pagination__jump {
    display: none !important;
  }
}
</style>
